<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>一只汪</title>
  <link rel="stylesheet" href="./首页.css">
  <link rel="stylesheet" href="./swiper.css">
</head>

<body>
  <!-- 导航 -->
  <nav>
    <div class="left">
      <img src="./images/logo1.png" alt="">
      <p>Study</p>
    </div>
    <div class="center">
      <ul>
        <a href="./首页.html">
          <li>课程首页<span></span></li>
        </a>
        <a href="./aside1.html">
          <li>家养汪汪<span></span></li>
        </a>
        <a href="./aside4.html">
          <li>汪汪图鉴</span><span></span></li>
        </a>
        <a href="./aside3.html">
          <li>汪汪电影<span></span></li>
        </a>
        <a href="">
          <li>汪汪常识<span></span></li>
        </a>
          <li> 
            <div class="n3"> 
            <a href="./登录.html"><img src="./images/h2.png" alt="" class="h2"></a>
            <input type="search" name="" id="search" placeholder="请输入关键字">
            </div>
         </li>
      </ul>
    </div>
  </nav>

  <!-- swiper轮播图 -->
  <div class="swiper-container rotation">
    <div class="swiper-wrapper">
      <img src="./img/轮播1.jpg" alt="" class="swiper-slide">
      <img src="./img/轮播2.jpg" alt="" class="swiper-slide">
      <img src="./img/轮播3.png" alt="" class="swiper-slide">
      <img src="./img/轮播4.jpg" alt="" class="swiper-slide">
    </div>
    <div class="swiper-pagination"></div>
    <div class="swiper-button-next"></div>
    <div class="swiper-button-prev"></div>
  </div>

  <!-- 中间内容 -->
  <div class="content">
    <div class="top">
      <span id="nowSpan"></span>
      <h1>了解内容
      </h1>
      <p class="xia">Basic introduction</p>
    </div>
  </div>

<!-- 中间横文 -->
     <div class="bottom">
      <div class="wrapper">
        <div class="one item">
          <div class="ribbon">高一课程内容</div>  
        </div>
        <div class="two item">知识讲义
           <div class="pacman"></div> 
        </div>
        <div class="three item">思维导图
          <div class="loader2"></div> 
        </div>
        <div class="four item">查漏补缺
           <div class="loader3"></div> 
        </div>
        <div class="five item">题库
          <div class="pencil"></div> 
        </div>
        <div class="six item">解题技巧
           <div class="thunder"></div>  
        </div>
        <div class="seven item">巩固基础
           <div class="battery"></div> 
        </div>
      </div>
    </div> 
    
  <div class="main">
    <div class="wrapper">
      <div class="one1 item">
        <div class="ribbon3">
          <div class="ribbon">高二课程内容</div>
        </div>
      </div>
      <div class="two item">知识讲义
        <div class="pacman"></div> 
      </div>
      <div class="three item">思维导图
         <div class="loader2"></div> 
      </div>
      <div class="four item">查漏补缺
      <div class="loader3"></div> 
      </div>
      <div class="five item">题库
        <div class="pencil"></div> 
      </div>
      <div class="six item">解题技巧
         <div class="thunder"></div> 
      </div>
      <div class="seven item">突破水平
        <div class="loader"></div> 
      </div>
    </div>
  </div>
  <div class="bottom2">
    <div class="wrapper">
      <div class="one2 item">
        <div class="ribbon">高三课程内容</div>
      </div>
      <div class="two item">一轮复习
        <div class="wifi-icon"></div> 
      </div>
      <div class="three item">二轮复习
         <div class="wifi-icon"></div> 
      </div>
      <div class="four item">历年真题
        <div class="hamburger-menu"></div> 
      </div>
      <div class="five item">全新题库
        <div class="pencil"></div> 
      </div>
      <div class="six item">诊断规划
         <div class="plus"></div> 
      </div>
      <div class="seven item">心理辅导
         <div class="loader1"></div> 
      </div>
    </div>
  </div>
 <div class="content3">
    <div class="left">
      <video controls="false" muted="muted" name="media" style="width:100%; height: 100%;">
        <source src="./video/ani.mp4" type="video/mp4">
      </video>
    </div>
    <div class="right">
      <ul>
        <li><h3>学习百科</h3></li>
        <li><a href="https://ipr.caas.cn/">一种厌氧微生物培养皿</a></li>
        <li><a href="https://baike.baidu.com/item/%E4%B8%89%E4%B8%80%E4%B9%9D%E6%9E%AA%E5%87%BB%E4%BA%8B%E4%BB%B6/128585?fr=ge_ala">三一九枪击事件
        </a></li>
        <li><a href="https://m.allhistory.com/">曹操成名的兵器，不是刀剑而是棍棒？</a></li>
        <li><a href="https://www.chemspider.com/">没想到化学分子这么有趣！！！</a></li>
        <li><a href="https://www.natgeo.com.cn/">《最后的鱼类巨兽》</a></li>
        <li><a href="https://baike.baidu.com/item/%E7%94%9F%E7%89%A9%E5%AD%A6/1358?fr=aladdin">生物学：自然科学五大基础之一</a></li>
      </ul>
    </div>
</div>

<div class="content4">
<div class="container">
  <div class="box">
      <div class="out-div out-front">
          <img src="./img/正方体1.png" alt="">
      </div>
      <div class="out-div out-back">
          <img src="./img/正方体2.jpg" alt="">
      </div>
      <div class="out-div out-left">
          <img src="./img/正方体3.jpg" alt="">
      </div>
      <div class="out-div out-right">
          <img src="./img/正方体4.png" alt="">
      </div>
      <div class="out-div out-top">
          <img src="./img/正方体5.jpg" alt="">
      </div>
      <div class="out-div out-bottom">
          <img src="./img/正方体6.jpg" alt="">
      </div>
      
       <div class="in-div in-front">
          <img src="./images/d7.jpg" alt="">
      </div>
      <div class="in-div in-back">
          <img src="./images/d8.jpeg" alt="">
      </div>
      <div class="in-div in-left">
          <img src="./images/d9.jpeg" alt="">
      </div>
      <div class="in-div in-right">
          <img src="./images/d10.jpg" alt="">
      </div>
      <div class="in-div in-top">
          <img src="./images/d11.jpg" alt="">
      </div>
      <div class="in-div in-bottom">
          <img src="./images/d12.jpeg" alt=""> 
      </div>
  </div>
</div>
<div class="right">
  <ul>
    <li><h3>学习小方法</h3></li>
    <li><a href="">&nbsp;&nbsp;&nbsp;&nbsp;制作学习卡片：随身携带
    俗话说：不积跬步，无以至千里，不积小流，无以成江海。
    <br /> &nbsp;&nbsp;&nbsp;&nbsp;随手笔记：
    俗话说：好记性不如烂笔头。大家在听课、复习、练习的时候，要养成整理笔记的习惯。把一些易错的知识点、容易忘记的知识都记录在笔记上，定期翻看。
    
    <br>&nbsp;&nbsp;&nbsp;错题整理和浏览：
    错题记录了要反复看，要自己亲自再做出来！
    <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    睡觉前回忆知识点：每次睡觉前，
    不妨做一下回忆复习，把自己今天学的内容在大脑里回顾。
    <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;适当运动保证身体健康：
    身体是革命的本钱,适当运动能保证你身体健康，同时运动后效率会提高很多</a></li>
  </ul>
</div>
</div>
  <footer>
    <div class="mains">
      <div id="marquee">
        <span id="marquee_text">
          知不足而奋进&nbsp;&nbsp;&nbsp;&nbsp;
         望远山而前行
        </span>
      </div>
      <p>Copyright ( C ) www.xuexi.com</p>
    </div>
  </footer>
  <script src="./js/swiper.min.js"></script>
  <script src="./index.js"></script>
  <script src="./js/time.js"></script>
</body>

</html>